<?php

use yii\helpers\Html;
$this->title='明源云客-官网管理-媒体管理';
?>
<script>
$(document).ready(function() {
	$('#search-btn').bind('click', function() {
        var keyword = $('#search-keyword').val();
        var dir_id = $('#dir-selector').val();
        var status = $('#status-selector').val();
        $(this).attr('disabled', 'disabled');
        $('#grid-table').setGridParam(
            {
                postData: {
                    keyword: keyword,
                    dir_id: dir_id,
                    status: status
                }
            }
        );
        $('#grid-table').trigger('reloadGrid');
        $('#clean-keyword-btn').css({ display: '' });
        $('#search-keyword').focus();
    });

    $('#search-keyword').bind('keypress', function(e) {
        if(e.keyCode == 13) {
            $('#search-btn').trigger('click');
            return false;
        }    else if(e.keyCode == 27) {
            $('#clean-keyword-btn').trigger('click');
            $(this).val('').blur().focus();
            return false;
        }
    }).focus();

    $('#clean-keyword-btn').bind('click', function() {
        $('#search-keyword').val('').focus();
        $('#dir-selector option:first').prop('selected',true);
        $('#status-selector option:nth-child(2)').prop('selected',true);
        $('#grid-table').setGridParam({
            postData: {
                keyword: $('#search-keyword').val(),
                dir_id: $('#dir-selector').val(),
                status: $('#status-selector').val()
            }
        });
        $('#grid-table').trigger('reloadGrid');
        $(this).hide();
    });

    $('#grid-table').jqGrid(
        {
            colNames: [
                '目录',
                '说明',
                '资源地址',
                '大小',
                '尺寸',
                '类型',
                '状态',
                '创建时间',
                '修改时间'
			],
            colModel: [
                { index: 'dir_id',name: 'dir_id', align: 'center', width: 50 },
                { index: 'name',name: 'name', align: 'left', width: 60, editable:true },
                { index: 'file',name: 'file', align: 'center', width: 120 },
                { index: 'size',name: 'size', align: 'center', width: 40 },
                { index: 'image_info',name: 'image_info', align: 'center', width: 40 },
                { index: 'type',name: 'type', align: 'center', width: 40 },
                { index: 'status', name: 'status', width: 40, align: 'center', editable: true, edittype: 'checkbox', formatter:'checkbox', editoptions:{value:'1:0'} },
                { index: 'created_time',name: 'created_time', align: 'left', width: 60 },
                { index: 'modified_time',name: 'modified_time', align: 'left', width: 60 }
            ],
            datatype: 'json',
            height: 'auto',
            autowidth: true,
			rowNum: 20,
            rowList: [10,20,50,100],
            viewrecords: true,
            viewsortcols: 'vertical',
			hoverrows: true,

            pager: $('#grid-pager'),
            sortname: 'id',
            sortorder: 'asc',
//			multiselect: true,
            cellEdit: true,
            cellurl: '?r=/official/media/quick-set',
			afterSubmitCell: function(serverresponse, rowid, cellname, value, iRow, iCol) {
				if(''!=serverresponse.responseText){
					var response = $.parseJSON(serverresponse.responseText); 
					return [false, response.errMsg];
				}else return [true];
			},
            loadComplete: function() {
                $('#search-btn').attr('disabled', false);
            },
            ondblClickRow: function(id) {
                window.location.href = '?r=/official/media/edit&id=' + id;
            }
        }
    ).navGrid(
        '#grid-pager',
        // options
        {
            search: false,
            addfunc: function() {
                window.location.href = '?r=/official/media/edit';
            },
            editfunc: function(id) {
                window.location.href = '?r=/official/media/edit&id=' + id;
            },
            del: false
        },
        // edit
        {
        },
        // add
        {
        },
        // del
        {
            url: '?r=/official/media/delete'
        }
    );
});
</script>

<div ng-view="" class="ng-scope">
    <div class="section-table mt20">
        <div class="table-header lh30 pb5 clearfix">
            <span class="fl f14">媒体列表</span>
            <div class="fr btn-group">
                <?php echo Html::dropDownList('dir-selector', '', \common\entities\official\DirEntity::getOptions('media'), ['id' => 'dir-selector', 'class' => 'fl input-text', 'prompt' => '', 'style' => '-moz-appearance:meterchunk;width:auto;']); ?>
                <?php echo Html::dropDownList('status-selector', 1, [1 => '显示', '0' => '隐藏'], ['id' => 'status-selector', 'class' => 'fl input-text', 'prompt' => '状态', 'style' => '-moz-appearance:meterchunk;width:auto;']); ?>
                <input type="text" placeholder="说明/类型" class="fl input-text w200" id="search-keyword">
                <?php echo Html::button('查询', ['id' => 'search-btn', 'class' => 'btn']); ?>
                <?php echo Html::button('清除', ['id' => 'clean-keyword-btn', 'class' => 'btn btn-yellow', 'style' => 'display: none;']); ?>
            </div>
        </div>
        <div class="mt10">
            <table  id="grid-table" width="100%" border="0" cellspacing="0" cellpadding="0" style="border:0px #DFDFDF solid"></table>
            <div id="grid-pager"></div>
        </div>
    </div>
</div>